<!DOCTYPE html>
<html lang="en">
<head>
    
    <meta charset="utf-8">
    <title>Home - Documentation</title>
    
    
    <script src="scripts/prettify/prettify.js"></script>
    <script src="scripts/prettify/lang-css.js"></script>
    <!--[if lt IE 9]>
      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <link type="text/css" rel="stylesheet" href="styles/prettify.css">
    <link type="text/css" rel="stylesheet" href="styles/jsdoc.css">
    <script src="scripts/nav.js" defer></script>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>

<input type="checkbox" id="nav-trigger" class="nav-trigger" />
<label for="nav-trigger" class="navicon-button x">
  <div class="navicon"></div>
</label>

<label for="nav-trigger" class="overlay"></label>

<nav >
    
    <input type="text" id="nav-search" placeholder="Search" />
    
    <h2><a href="index.html">Home</a></h2><h3>Classes</h3><ul><li><a href="openBSE.BrowserNotSupportError.html">BrowserNotSupportError</a></li><li><a href="openBSE.Contextmenu.html">Contextmenu</a><ul class='methods'><li data-type='method' style='display: none;'><a href="openBSE.Contextmenu.html#closeContextmenu">closeContextmenu</a></li><li data-type='method' style='display: none;'><a href="openBSE.Contextmenu.html#getBulletScreenEvent">getBulletScreenEvent</a></li><li data-type='method' style='display: none;'><a href="openBSE.Contextmenu.html#getContextmenuState">getContextmenuState</a></li></ul></li><li><a href="openBSE.GeneralEngine.html">GeneralEngine</a><ul class='methods'><li data-type='method' style='display: none;'><a href="openBSE.GeneralEngine.html#add">add</a></li><li data-type='method' style='display: none;'><a href="openBSE.GeneralEngine.html#bind">bind</a></li><li data-type='method' style='display: none;'><a href="openBSE.GeneralEngine.html#cleanBuffer">cleanBuffer</a></li><li data-type='method' style='display: none;'><a href="openBSE.GeneralEngine.html#cleanScreen">cleanScreen</a></li><li data-type='method' style='display: none;'><a href="openBSE.GeneralEngine.html#pause">pause</a></li><li data-type='method' style='display: none;'><a href="openBSE.GeneralEngine.html#play">play</a></li><li data-type='method' style='display: none;'><a href="openBSE.GeneralEngine.html#playAllBulletScreens">playAllBulletScreens</a></li><li data-type='method' style='display: none;'><a href="openBSE.GeneralEngine.html#stop">stop</a></li><li data-type='method' style='display: none;'><a href="openBSE.GeneralEngine.html#unbind">unbind</a></li></ul></li></ul><h3>Events</h3><ul><li><a href="openBSE.GeneralEngine.html#event:click">click</a></li><li><a href="openBSE.GeneralEngine.html#event:contextmenu">contextmenu</a></li><li><a href="openBSE.GeneralEngine.html#event:mouseenter">mouseenter</a></li><li><a href="openBSE.GeneralEngine.html#event:mouseleave">mouseleave</a></li></ul><h3>Namespaces</h3><ul><li><a href="openBSE.html">openBSE</a><ul class='methods'><li data-type='method' style='display: none;'><a href="openBSE.html#.getVersion">getVersion</a></li></ul></li></ul>
</nav>

<div id="main">
    

    



    


    <section class="package">
        <h3> </h3>		
    </section>









    



    <section class="readme usertext">
        <article><h1>openBSE Documentation</h1>
<p><a href="https://github.com/iamscottxu/openBSE/releases/tag/v3.0"><img src="https://img.shields.io/badge/version-3.0-brightgreen.svg?style=flat-square" alt="Version 3.0"></a>
<a href="https://www.npmjs.com/package/openbse"><img src="https://img.shields.io/npm/v/openbse.svg?style=flat-square" alt="NPM"></a>
<a href="https://github.com/iamscottxu/openBSE/blob/master/LICENSE"><img src="https://img.shields.io/github/license/mashape/apistatus.svg?style=flat-square" alt="MIT"></a></p>
<p><a href="https://github.com/iamscottxu/openBSE/wiki">wiki</a> |
<a href="https://iamscottxu.github.io/openBSE/demo/openBSEDemo.html">Demo</a></p>
<p><strong>欢迎来到 openBSE 文档！</strong></p>
<p>openBSE 是一个一个高性能 JavaScript 弹幕引擎，简单易用。支持 CSS3 、 Canvas 2D 、 WebGL 和 SVG 渲染方式。支持顶部、底部、逆向弹幕渲染。使用 Canvas 2D 渲染方式可同屏渲染至少1000条弹幕（可达1600条，与电脑配置有关）。</p>
<h2>安装和使用</h2>
<h3>安装</h3>
<p>你可以直接点击<a href="https://github.com/iamscottxu/openBSE/releases/tag/v3.0">这里</a>下载最新发行版本，也可以用以下命令安装NPM包。</p>
<pre class="prettyprint source lang-Bash"><code>> npm install openbse
</code></pre>
<h3>使用</h3>
<p>安装完成后，在 Html 页面引入。</p>
<p>压缩版：</p>
<pre class="prettyprint source lang-Html"><code>&lt;script src=&quot;openBSE.all.min.js&quot;>&lt;/script>
</code></pre>
<p>调试版：</p>
<pre class="prettyprint source lang-Html"><code>&lt;script src=&quot;openBSE.all.js&quot;>&lt;/script>
</code></pre>
<p>添加一个 id 为 <code>BulletScreensDiv</code> 的固定大小的 div 标签用于显示弹幕，并插入以下 JavaScript 代码。</p>
<pre class="prettyprint source lang-JavaScript"><code>var bulletScreenEngine = new openBSE.BulletScreenEngine(document.getElementById('BulletScreensDiv'));
var _startTime = 5000;
for (var i = 0; i &lt; 10000; i++) {
    bulletScreenEngine.addBulletScreen({
        text: &quot;这是一个长长长长长长长长长长长长长长长长长长长长长长长长的测试(^_^)&quot;,
        startTime: _startTime
    });
    _startTime += Math.round(Math.random() * 300);
}
bulletScreenEngine.play();
</code></pre>
<p>用浏览器打开网页即可显示弹幕。</p>
<p>详细使用说明请查看 <a href="https://github.com/iamscottxu/openBSE/wiki">wiki</a> 。</p>
<h2>联系作者</h2>
<p>如果有任何问题请写下 <a href="https://github.com/iamscottxu/openBSE/issues">issues</a> 。<br/>
E-mail：<a href="mailto:scottxu@scottxublog.com">scottxu@scottxublog.com</a></p>
<h2>版权声明</h2>
<p>这个项目是一个开源项目，遵循 MIT 开源协议。要查看协议，请点击<a href="https://github.com/iamscottxu/openBSE/blob/master/LICENSE">这里</a>。</p></article>
    </section>






    
    
</div>

<br class="clear">

<footer>
    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.5</a> on Fri Sep 04 2020 11:42:03 GMT+0800 (中国标准时间) using the <a href="https://github.com/clenemt/docdash">docdash</a> theme.
</footer>

<script>prettyPrint();</script>
<script src="scripts/polyfill.js"></script>
<script src="scripts/linenumber.js"></script>

<script src="scripts/search.js" defer></script>


<script src="scripts/collapse.js" defer></script>


</body>
</html>